// 前端API测试脚本
// 在浏览器控制台中运行此脚本来测试图像生成功能

async function testImageGenerationFromFrontend() {
  console.log('🧪 开始测试前端图像生成API调用...')
  
  const testData = {
    model: 'doubao-seededit-3-0-i2i-250628',
    prompt: '改成爱心形状的泡泡',
    image: 'https://ark-project.tos-cn-beijing.volces.com/doc_image/seededit_i2i.jpeg',
    response_format: 'url',
    size: 'adaptive',
    seed: 21,
    guidance_scale: 5.5,
    watermark: true
  }
  
  console.log('📝 请求参数:', testData)
  
  try {
    const startTime = Date.now()
    
    const response = await fetch('http://localhost:3001/api/generate-image', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify(testData)
    })
    
    const endTime = Date.now()
    const duration = ((endTime - startTime) / 1000).toFixed(2)
    
    console.log(`⏱️ 请求耗时: ${duration}秒`)
    
    if (!response.ok) {
      throw new Error(`HTTP ${response.status}: ${response.statusText}`)
    }
    
    const result = await response.json()
    
    console.log('✅ 请求成功!')
    console.log('📊 完整响应数据:', result)
    
    if (result.success && result.data) {
      const apiData = result.data
      console.log('🔍 数据结构分析:')
      console.log('  - 数据类型:', typeof apiData)
      console.log('  - 是否有data数组:', !!apiData.data)
      console.log('  - data数组长度:', apiData.data ? apiData.data.length : 'N/A')
      console.log('  - 第一个图像URL:', apiData.data?.[0]?.url || 'N/A')
      console.log('  - 模型:', apiData.model || 'N/A')
      console.log('  - 创建时间:', apiData.created || 'N/A')
      
      if (apiData.data?.[0]?.url) {
        const imageUrl = apiData.data[0].url
        console.log('🖼️ 图像URL:', imageUrl)
        
        // 创建图像元素测试加载
        const img = new Image()
        img.onload = function() {
          console.log('✅ 图像加载成功!')
          console.log('  - 图像尺寸:', this.naturalWidth + 'x' + this.naturalHeight)
        }
        img.onerror = function() {
          console.error('❌ 图像加载失败!')
        }
        img.src = imageUrl
        
        // 在页面中显示图像（如果在浏览器中运行）
        if (typeof document !== 'undefined') {
          const container = document.createElement('div')
          container.style.cssText = `
            position: fixed;
            top: 20px;
            right: 20px;
            background: white;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(0,0,0,0.3);
            z-index: 10000;
            max-width: 300px;
          `
          
          const title = document.createElement('h3')
          title.textContent = '生成的图像'
          title.style.margin = '0 0 10px 0'
          
          const image = document.createElement('img')
          image.src = imageUrl
          image.style.cssText = 'max-width: 100%; border-radius: 4px;'
          
          const closeBtn = document.createElement('button')
          closeBtn.textContent = '关闭'
          closeBtn.style.cssText = `
            background: #f56c6c;
            color: white;
            border: none;
            padding: 5px 10px;
            border-radius: 4px;
            cursor: pointer;
            margin-top: 10px;
          `
          closeBtn.onclick = () => document.body.removeChild(container)
          
          container.appendChild(title)
          container.appendChild(image)
          container.appendChild(closeBtn)
          document.body.appendChild(container)
        }
        
        return {
          success: true,
          imageUrl: imageUrl,
          data: apiData
        }
      } else {
        console.error('❌ 无法获取图像URL')
        return {
          success: false,
          error: '无法获取图像URL',
          data: apiData
        }
      }
    } else {
      console.error('❌ API返回失败:', result.message || '未知错误')
      return {
        success: false,
        error: result.message || '未知错误',
        data: result
      }
    }
    
  } catch (error) {
    console.error('❌ 请求失败:', error.message)
    return {
      success: false,
      error: error.message
    }
  }
}

// 如果在Node.js环境中，需要安装node-fetch
if (typeof window === 'undefined' && typeof fetch === 'undefined') {
  console.log('⚠️ 此脚本需要在浏览器环境中运行，或者安装node-fetch包')
  console.log('在浏览器控制台中运行: testImageGenerationFromFrontend()')
} else {
  // 在浏览器中自动运行
  if (typeof window !== 'undefined') {
    console.log('🌐 在浏览器环境中检测到，可以运行测试')
    console.log('运行命令: testImageGenerationFromFrontend()')
    
    // 将函数添加到全局作用域
    window.testImageGenerationFromFrontend = testImageGenerationFromFrontend
  }
}

// 导出函数（如果在模块环境中）
if (typeof module !== 'undefined' && module.exports) {
  module.exports = { testImageGenerationFromFrontend }
}
